<style>
	.form-group .has-error input{
		border-color: #f00;
	}
</style>
<div class="content container">
	<form method='post' id="myform1" action="{:URL('User-Index/profile')}">
		<div class="center-data">
			<div class="form-group clearfix">
				<label for="inputUser" class="col-sm-2">个人账号</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" class="form-control" id="inputUser" value="{$vo['username']}" disabled>
				</div>
			</div>
			<div class="form-group clearfix mb-40">
				<label for="inputName" class="col-sm-2">修改昵称</label>
				<div class="col-md-6 col-sm-10">
					<input type="text" value="{$vo.realname}" name="realname" class="form-control" required id="realname" minlength="2" maxlength="10">
				</div>
			</div>
			<div class="form-group clearfix">
				<div class="col-sm-offset-2 col-sm-10">
					<input type="hidden" name="dosubmit" value=1>
					<button type="submit" class="btn btn-primary">{:L('dosubmit')}</button>
				</div>
			</div>
	</form>
	<form method='post' id="myform" action="{:URL('User-Index/password')}">
		<!-- 原始密码 -->
		<div class="form-group clearfix">
			<label for="pwd" class="col-sm-2">{:L('oldpassword')}</label>
			<div class="col-md-6 col-sm-10">
				<input type="password" class="form-control" name="oldpassword" id="oldpassword" minlength="5" maxlength="20">
			</div>
		</div>
		<!-- 修改密码 -->
		<div class="form-group clearfix">
			<label for="newPwd" class="col-sm-2">{:L('newpassword')}</label>
			<div class="col-md-6 col-sm-10">
				<input type="password" class="form-control" id="password" name="password" minlength="5" maxlength="20">
			</div>
		</div>
		<!-- 确定密码 -->
		<div class="form-group clearfix mb-40">
			<label for="newPwdConfirm" class="col-sm-2">{:L('repassword')}</label>
			<div class="col-md-6 col-sm-10">
				<input type="password" id="repassword" class="form-control" name="repassword" minlength="5" maxlength="20">
			</div>
		</div>
		<div class="form-group clearfix">
			<div class="col-sm-offset-2 col-sm-10">
				<input type="hidden" name="dosubmit" value=1>
				<button type="submit" class="btn btn-primary">{:L('dosubmit')}</button>
			</div>
		</div>
	</form>
	</div>
	<script>
		(function () {

			//密码输入 检测
			var pws = document.querySelectorAll("[type='password']");
			for (var i = 0; i < pws.length; i++) {
				pws[i].addEventListener("input", function () {
					var b = isInput();
					setRequired(b);

				})
			}
			//密码是否是输入的状态
			function isInput() {
				var b = false;
				for (var i = 0; i < pws.length; i++) {
					if (pws[i].value) {
						b = true;
						break;
					}
				}
				return b;
			}
			//设置强制火解除
			function setRequired(b) {
				for (var i = 0; i < pws.length; i++) {
					pws[i].required = b;
				}
			}
			//密码重复输入判断
			var ps = document.querySelectorAll("#password,#repassword");
			for (var i = 0; i < ps.length; i++) {
				ps[i].addEventListener("blur", function () {
					var b = ps[0].value === ps[1].value;
					console.log(b,this.parentNode);
					if (b) {
						ps[1].parentNode.classList.remove("has-error")
					} else {
						ps[1].parentNode.classList.add("has-error")
					}
				})
			}

		})()

	</script>